<template>
  <div>
    <el-dialog
      title="查看详情"
      :visible.sync="dialogVisible"
      width="50%"
      :before-close="handleClose">
      <el-table :data="payDetailInfoList">
        <el-table-column prop="warehouseInfo.warName" label="仓库名"></el-table-column>
        <el-table-column prop="supplierSupplyOfGoods.shop.shopName" label="商品名"></el-table-column>
        <el-table-column prop="shopNum" label="入库商品数量"></el-table-column>
      </el-table>
      <div>
        <!-- 分页 -->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageno"
          :page-sizes="[5, 10, 15, 20]"
          :page-size="pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        >
        </el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleClose">关闭</el-button>
        </span>
    </el-dialog>
  </div>
</template>

<script>
    export default {
        name: "payDetailInfo_dialog",
        data(){
          return{
            id:null,
            dialogVisible:false,
            payDetailInfoList:[],
            pageno: 1,
            pagesize: 5,
            total: 1
          }
        },
        methods:{
          getData(id){
            let payDetailInfo={
              payId:id,//父id
              isDelete:0//未删除
            };
            let params=new URLSearchParams();
            params.append("pageno", this.pageno);
            params.append("pagesize", this.pagesize);
            Object.keys(payDetailInfo).forEach(item=>{
              params.append(item,payDetailInfo[item]);
            })
            //异步，分页查询
            this.$axios.get("payDetailInfo/payDetailInfo.action",{params:params}).
            then((response)=> {   //异步调用成功执行
              //将查询到的数据存入对象数组中
              this.payInfoList=response.data.records;
              this.total = response.data.total;
            });
          },
          handleSizeChange(val) {
            //每页范围
            this.pagesize = val;
            this.getData(this.id);
          },
          handleCurrentChange(val) {
            //当前页
            this.pageno = val;
            this.getData(this.id);
          },
          handleClose() {
            //关闭
            this.dialogVisible=false;
            this.payInfoList=[];
          },
        }
    }
</script>

<style scoped>

</style>
